{extend name="admin@public/basic" /}
{block name="style"}
<link rel="stylesheet" href="__STATIC__/css/admin/public.css" media="all"/>
<link rel="stylesheet" type="text/css" href="__STATIC__/plugs/wangEditor-3.1.1/release/wangEditor.min.css"/>
<link href="__STATIC__/plugs/tag-it/css/jquery.tagit.css" rel="stylesheet" type="text/css">
<link href="__STATIC__/plugs/tag-it/css/tagit.ui-zendesk.css" rel="stylesheet" type="text/css">
<style>
    .toolbar {
        border: 1px solid #ccc;
    }

    .edit-bg {
        border: 1px solid #ccc;
        background-color: #f4f4f4;
        min-height: 300px;
    }
</style>
{/block}
{block name="cotent"}
<form class="layui-form form-width-admin" action="" id="formBox">

    <div class="layui-form-item">
        <label for="hotel_num" class="layui-form-label">{:__('hotel_num')}:</label>
        <div class="layui-input-block">
            <input id="hotel_num" class="layui-input" name="hotel_num" type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="name" class="layui-form-label">{:__('name')}:</label>
        <div class="layui-input-block">
            <input id="name" class="layui-input" name="name" type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="province" class="layui-form-label">{:__('province')}:</label>
        <div class="layui-input-block">
            <select  id="province" class="layui-input selectpicker" name="province" lay-filter="province">
                {foreach name="provinceList" item="vo"}
                    <option value="{$key}" {in name="key" value=""}selected{/in}>{$vo}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label for="city" class="layui-form-label">{:__('city')}:</label>
        <div class="layui-input-block">
            <select  id="city" class="layui-input selectpicker" name="city" lay-filter="city">
                {foreach name="firstCityList" item="vo"}
                    <option value="{$key}" {in name="key" value=""}selected{/in}>{$vo}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label for="address" class="layui-form-label">{:__('address')}:</label>
        <div class="layui-input-block">
            <input id="address" class="layui-input" name="address" type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="contacts" class="layui-form-label">{:__('contacts')}:</label>
        <div class="layui-input-block">
            <input id="contacts" class="layui-input" name="contacts" type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="contact_tel" class="layui-form-label">{:__('contact_tel')}:</label>
        <div class="layui-input-block">
            <input id="contact_tel" class="layui-input" name="contact_tel" type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="create_time" class="layui-form-label">{:__('create_time')}:</label>
        <div class="layui-input-block">
            <input id="create_time" class="layui-input datetimepicker" data-date-format="YYYY-MM-DD HH:mm:ss" data-use-current="true" name="create_time" type="text" value="{:date('Y-m-d H:i:s')}">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="status" class="layui-form-label">{:__('status')}:</label>
        <div class="layui-input-block">
                        
            {foreach name="statusList" item="vo"}
            <input type="radio" name="status" value="{$key}" title="{$vo}" {in name="key" value="1"}checked="checked"{/in}><div class="layui-unselect layui-form-radio layui-form-radioed"><i class="layui-anim layui-icon layui-anim-scaleSpring"></i><div>{$vo}</div></div>
            {/foreach}
        </div>
    </div>
    <div class="layui-form-item">
        <label for="commission" class="layui-form-label">{:__('commission')}:</label>
        <div class="layui-input-block">
            <input id="commission" class="layui-input" step="0.01" name="commission" type="number">
        </div>
    </div>

    <div class="layui-form-item layui-row layui-col-xs12">
        <div class="layui-input-block">
            <button class="layui-btn layui-btn-sm" id="submitBtn">提交</button>
            <button class="layui-btn layui-btn-sm layui-btn-primary" data-close="closeOpen">取消</button>
        </div>
    </div>
</form>
{/block}

{block name="script"}
<script type="text/javascript" src="/static/plugs/tag-it/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="__STATIC__/plugs/tag-it/js/tag-it.js" charset="utf-8"></script>
<script type="text/javascript" src="__STATIC__/plugs/wangEditor-3.1.1/release/wangEditor.min.js"></script>
<script type="text/javascript">
    layui.use(['form', 'layedit', 'laydate', 'upload'], function () {
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , upload = layui.upload
            , laydate = layui.laydate;

        /**
         * 上传图片处理
         */
        $.form.imageRender('upload_image_div', 'one');


        /**
         *编辑器初始化
         */
        var E = window.wangEditor;
        var editor = new E('#editor1', '#editor2');
        editor.customConfig.uploadImgServer = "{:url('@admin/api.upload/image')}";
        editor.customConfig.uploadFileName = 'image';
        editor.customConfig.pasteFilterStyle = false;
        editor.customConfig.uploadImgMaxLength = 5;
        editor.customConfig.uploadImgHooks = {
            timeout: function (xhr, editor) {
                $.msg.error('上传超时！')
            },
            // 如果服务器端返回的不是 {errno:0, data: [...]} 这种格式，可使用该配置
            customInsert: function (insertImg, result, editor) {
                console.log(result);
                if (result.code == 0) {
                    url = result.url;
                    url.forEach(function (e) {
                        insertImg(e);
                    })
                } else {
                    $.msg.error(result.msg);
                }
            }
        }
        editor.customConfig.customAlert = function (info) {
            layer.msg(info);
        }
        editor.create();

        /**
         * 添加酒店
         */
        $("#submitBtn").click(function () {
            $.request.post('{:url("$thisRequest")}', $('#formBox').serializeArray(), function (res) {
                $.msg.success(res.msg, function () {
                    $.tool.reload('open');
                });
            });
            return false;
        });

        form.on('select(province)', function(data){
            var province = data.value;
            $.get('{:url("$thisClass/getCity")}',{province:province},function (res){
                $('#city').find('option').remove();
                var html = '';
                Object.keys(res).forEach(function(key){
                    html += "<option value='" + key + "'>" + res[key] + "</option>";
                });
                $("#city").append(html);
                //append后必须从新渲染
                form.render('select');
            });
        });
    })

</script>
{/block}